// pages/setting/setting.js
const validateUtil = require('../../utils/validateUtil')
const {
  updateUsername,
  updateUserAvatar,
  updateUserEmail,
  updateUserPassword,
} = require('../../apis/api')

import { createStoreBindings } from 'mobx-miniprogram-bindings'
import { store } from '../../store/store'
import Notify from '@vant/weapp/notify/notify'
import Toast from '@vant/weapp/toast/toast'
import Dialog from '@vant/weapp/dialog/dialog'

Page({

  /**
   * 页面的初始数据
   */
  data: {
    newUsername: "",
    newEmail: "",
    emailVerifyCode: "",
    newPassword: "",
    newConfirmPassword: "",

    usernameShow: false,
    emailShow: false,
    passwordShow: false
  },

  /**
   * 选择头像时回调函数
   */
  onChooseAvatar(e) {
    Toast.loading({
      type: 'loading',
      message: '图片上传中...',
      selector: "#toast",
      context: this,
      mask: true,
      duration: 0
    })

    // 获取图片本地路径
    let path = e.detail.avatarUrl
    // 图片上传
    updateUserAvatar(path, this.data.token, (res) => {
      res = JSON.parse(res.data)
      if (res.code === 200) {
        // 登陆成功，设置全局变量
        this.setUsername(res.data.username)
        this.setUserAvatar(res.data.userAvatar)
        this.setEmail(res.data.email)
        this.setToken(res.data.token)
        // 持久化登录态
        wx.setStorageSync('token', res.data.token)
        
        // 发起成功通知
        Notify({
          type: 'success',
          message: '修改成功',
          selector: "#notice",
          context: this
        })
      } else {
        // 失败
        Notify({
          type: 'warning',
          message: res.message,
          selector: "#notice",
          context: this
        })
      }
      Toast.clear()
    })
  },

  // -------------------用户名---------------------
  /**
   * 修改用户名（解决因为开放能力：nickname导致的数据变化监听失败）
   */
  onUsernameInputFixed(e) {
    this.setData({
      newUsername: e.detail.value
    })
  },

  /**
   * 弹框：修改用户名
   */
  onShowUsernameUpdate() {
    // 初始化数据
    this.setData({
      newUsername: this.data.username,
      usernameShow: true
    })
  },
  /**
   * 确认：修改用户名
   */
  onConfirmUsernameUpdate() {
    let username = this.data.newUsername
    // 数据校验
    if(!validateUtil.validateUsername(username)) {
      wx.showToast({
        title: '用户名不符合规则',
        icon: 'none'
      })
      return
    }
    
    Toast.loading({
      type: 'loading',
      message: '修改中...',
      selector: "#toast",
      context: this,
      mask: true,
      duration: 0
    })
    // 修改用户名
    updateUsername(username, this.data.token, (res) => {
      if (res.data.code === 200) {
        // 登陆成功，设置全局变量
        this.setUsername(res.data.data.username)
        this.setUserAvatar(res.data.data.userAvatar)
        this.setEmail(res.data.data.email)
        this.setToken(res.data.data.token)
        // 持久化登录态
        wx.setStorageSync('token', res.data.data.token)
        
        // 发起成功通知
        Notify({
          type: 'success',
          message: '修改成功',
          selector: "#notice",
          context: this
        })
      } else {
        // 失败
        Notify({
          type: 'warning',
          message: res.data.message,
          selector: "#notice",
          context: this
        })
      }
      Toast.clear()
    })

    // 数据调整
    this.setData({
      usernameShow: false
    })
  },
  /**
   * 取消：修改用户名
   */
  onCancelUsernameUpdate() {
    this.setData({
      usernameShow: false
    })
  },

  // -------------------邮箱---------------------
  /**
   * 弹框：修改邮箱
   */
  onShowEmailUpdate() {
    // 初始化数据
    this.setData({
      newEmail: this.data.email,
      emailVerifyCode: "",
      emailShow: true
    })
  },
  /**
   * 确认：修改邮箱
   */
  onConfirmEmailUpdate() {
    let email = this.data.newEmail
    let code = this.data.emailVerifyCode
    // 数据校验
    if (!validateUtil.validateEmail(email)) {
      wx.showToast({
        title: '请输入正确的邮箱',
        icon: 'none'
      })
      return
    }
    if (code === "" || code == undefined) {
      wx.showToast({
        title: '请输入验证码',
        icon: 'none'
      })
      return
    }

    Toast.loading({
      type: 'loading',
      message: '修改中...',
      selector: "#toast",
      context: this,
      mask: true,
      duration: 0
    })
    // 修改邮箱
    updateUserEmail(email, code, this.data.token, (res) => {
      if (res.data.code === 200) {
        // 登陆成功，设置全局变量
        this.setUsername(res.data.data.username)
        this.setUserAvatar(res.data.data.userAvatar)
        this.setEmail(res.data.data.email)
        this.setToken(res.data.data.token)
        // 持久化登录态
        wx.setStorageSync('token', res.data.data.token)
        
        // 发起成功通知
        Notify({
          type: 'success',
          message: '修改成功',
          selector: "#notice",
          context: this
        })
      } else {
        // 失败
        Notify({
          type: 'warning',
          message: res.data.message,
          selector: "#notice",
          context: this
        })
      }
      Toast.clear()
    })
    // 数据调整
    this.setData({
      emailShow: false
    })
  },
  /**
   * 取消：修改邮箱
   */
  onCancelEmailUpdate() {
    this.setData({
      emailShow: false
    })
  },

  // -------------------密码---------------------
  /**
   * 弹框：修改密码
   */
  onShowPasswordUpdate() {
    // 初始化数据
    this.setData({
      newPassword: "",
      newConfirmPassword: "",
      emailVerifyCode: "",
      passwordShow: true
    })
  },
  /**
   * 确认：修改密码
   */
  onConfirmPasswordUpdate() {
    let password = this.data.newPassword
    let confirmPassword = this.data.newConfirmPassword
    let code = this.data.emailVerifyCode
    // 数据校验
    if (!validateUtil.validatePassword(password)) {
      wx.showToast({
        title: '密码至少包含一个字母，数字以及特殊字符',
        icon: 'none'
      })
      return
    }
    if (confirmPassword !== password) {
      wx.showToast({
        title: '两次密码输入不一致',
        icon: 'none'
      })
      return
    }
    if (code === "" || code == undefined) {
      wx.showToast({
        title: '请输入验证码',
        icon: 'none'
      })
      return
    }

    Toast.loading({
      type: 'loading',
      message: '修改中...',
      selector: "#toast",
      context: this,
      mask: true,
      duration: 0
    })
    // 修改密码
    updateUserPassword(password, code, this.data.token, (res) => {
      if (res.data.code === 200) {
        // 登陆成功，设置全局变量
        this.setUsername(res.data.data.username)
        this.setUserAvatar(res.data.data.userAvatar)
        this.setEmail(res.data.data.email)
        this.setToken(res.data.data.token)
        // 持久化登录态
        wx.setStorageSync('token', res.data.data.token)
        
        // 发起成功通知
        Notify({
          type: 'success',
          message: '修改成功',
          selector: "#notice",
          context: this
        })
      } else {
        // 失败
        Notify({
          type: 'warning',
          message: res.data.message,
          selector: "#notice",
          context: this
        })
      }
      Toast.clear()
    })
    
    // 数据调整
    this.setData({
      passwordShow: false
    })
  },
  /**
   * 取消：修改密码
   */
  onCancelPasswordUpdate() {
    this.setData({
      passwordShow: false
    })
  },


  /**
   * 退出登陆
   */
  logout() {
    Dialog.confirm({
      title: '退出',
      message: '是否确定退出登陆',
      context: this,
      selector: "#logOutDialog"
    })
      .then(() => {
        // on confirm
        this.setUsername('')
        this.setUserAvatar('')
        this.setEmail('')
        this.setToken('')
        wx.removeStorageSync('token')
        
        wx.reLaunch({
          url: '/pages/login/login',
        })
      })
      .catch(() => {
        // on cancel
      });
    
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.storeBindings = createStoreBindings(this, {
      store,
      fields: ['username', 'userAvatar', 'email', 'token'],
      actions: ['setUsername', 'setUserAvatar', 'setEmail', 'setToken'],
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {
    this.storeBindings.destroyStoreBindings()
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})